<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <title>人员离职</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--字体-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--图标-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <!--插件样式-->
    <link href="/dist/plugins/ztree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/dist/plugins/webuploader-0.1.5/webuploader.css">
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=86e2297f">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=222aea35">
</head>
<style>
    .IcoNormal {
        float: left;
        border-bottom: 0px;
        border-left: 0px;
        background-color: transparent;
        width: 16px;
        height: 16px;
        vertical-align: middle;
        border-top: 0px;
        border-right: 0px;
        background-image: url(../../statics/img/upload_normal.gif);
        background-repeat: no-repeat;
        float: left;
    }
</style>
<body>
<iframe id="ifAttach" style="display:none"></iframe>
<section class="content " id="app">
        <table class="table-detail">
            <tr>
                <td class="td-title">离职原因</td>
                <td><textarea v-model="user.leaveReason" id="leaveReason"></textarea></td>
            </tr>
        </table>
        <div class="body" style="overflow: hidden;">
            <div id="divUpload" style="float: left; ">
                添加附件
            </div>
        </div>
        <div id="divUploadedFiles">
            <div v-for="(attach,i) in user.attaches" class="progressobj" @click="download(attach.url,attach.name)">
                <input type="button" class="IcoNormal" style="float:left;"/>
                <div class="filename" style="float:left;">
                    {{attach.name}}
                </div>
                <div class="delfile"><a v-on:click="deleteFile(i)">删除</a></div>
            </div>
        </div>

        <input type="button" value="离职" @click="remove()" class="btn oaBtn"
               style="margin-top:100px;">
</section>
<!--JQ-->
<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<!--插件JS-->
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<!--框架已定义 JS-->
<script src="/dist/js/app_iframe.js?t=8e743a31"></script>
<!--oa自定义  JS-->
<script src="/dist/js/oa.js?t=54c6b89c"></script>

<script src="https://file.ggxqce.com/web/vue.min.js"></script>
<!--ztree组件所需js-->
<script type="text/javascript" src="/dist/plugins/ztree/js/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript" src="/dist/plugins/ztree/js/jquery.ztree.exhide-3.5.js"></script>
<script src="/dist/plugins/webuploader-0.1.5/webuploader.min.js"></script>
<script type="text/javascript" src="/dist/js/pages/common/commonService.js"></script>
<script type="text/javascript" src="/dist/js/pages/system/systemService.js"></script>
<script type="text/javascript">
    var api = frameElement.api, W = api.opener;
    var app = new Vue({
        el: '#app',
        data: {
            user: {
                id: '',
                updateUserId: getCurrentUser().id,
                attaches: [],
                leaveReason: ''
            }

        },
        methods: {
            deleteFile: function (i) {
                this.user.attaches.splice(i, 1);
            },
            download: function (attachId, fileName) {
                downloadFile(attachId,fileName)
                return false;
            },
            remove: function () {
                var self = this
                $.wyui.postMethod(urlConfig.system.user.deleteUser, self.user, function (r) {
                    alert("删除成功");
                    parent.refresh();
                    api.close();
                });
            }
        },
        mounted: function () {
            var that = this;
            this.uploader = WebUploader.create({
                // 选完文件后，是否自动上传。
                auto: true,
                // swf文件路径
                swf: "/statics/plugin/webuploader-0.1.5/Uploader.swf",
                // 文件接收服务端。
                server: server.fjIp + "/attach/uploadFile.json",
                // 选择文件的按钮。可选。
                // 内部根据当前运行是创建，可能是input元素，也可能是flash.
                pick: '#divUpload',
                duplicate: true
            });
            this.uploader.on("uploadStart", function () {
                $("#progress").show();
            });
            this.uploader.on("uploadComplete", function () {
                $("#progress").hide();
            });
            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            this.uploader.on('uploadSuccess', function (file, response) {

                that.user.attaches.push({id: response.id, name: response.name, url: response.url});
            });

            // 文件上传失败，显示上传出错。
            this.uploader.on('uploadError', function (file) {
                alert("上传失败！");
            });
            if ($.wyui.page.urlParams.userId) {
                commonService.getAttachesByModuleId({moduleId: $.wyui.page.urlParams.userId}, function (attaches) {
                    that.user.id = $.wyui.page.urlParams.userId;
                    that.user.attaches = attaches;
                });
            }
        }

    });
</script>
</body>
</html>